/*
  全局管理user的数据
  1. state: 
    token(设置token, 随时访问, 判断token是否存在, 存在就直接登录)
    userInfo(用户登录后的信息, 存储)
  2. mutations:
    设置token, 修改userInfo
  3. actions:
    在用户登录后, 将token设置到 state.token, 设置直接根据token, 请求user

*/
import { ElNotification } from 'element-plus'
import { defineStore } from 'pinia'
import store from 'store'

import $http from '@/api/http'
import base from '@/config/base.config'
import { router } from '@/router/index'
import { useSocket } from '@/store/socket'
import _isMobile from '@/unit/isMobile'
const { TOKEN_NAME } = base

// 判断是否为自己主动退出, 默认为false
/*
  $io需要使用的东西
  1. 完成io实例,
  2. 绑定on登录事件
  3. 绑定emit, 退出登录事件
  问题, 是否需要通过store的方法进行封装, 或者直接获取值进行操作
    如果直接操作: 就需要依赖创建$io
    如果分段操作: 用户登录时, 创建$io实例, 可以点击socket页面进行登录
*/
let isCore = false
let isMobile = _isMobile()
export const useUser = defineStore('user', {
  state: () => {
    return {
      // 这里管控整个token, 直接 从localStore获取
      token: store.get(TOKEN_NAME) || '',
      userInfo: {},
    }
  },
  actions: {
    logout() {
      const socket = useSocket()
      if (!isMobile) {
        isCore = true
        socket.$io?.close()
      }
      this.token = ''
      store.remove(TOKEN_NAME)
      this.userInfo = {}
      router.push('/index')
      ElNotification({
        title: '退出成功',
        message: '下次再见',
        type: 'success',
      })
    },
    online() {
      const socket = useSocket()
      // 在main中只挂在一个socket会话
      socket.getIo(true)
      let ws = socket.$io
      ws.emit('online', { uid: this.userInfo?._id, nickName: this.userInfo?.nickName })
      ws.on('disconnect', () => {
        socket.cleanIo()
        let nickName = this.userInfo?.nickName
        let message = `亲爱的${nickName}, 你已经在其他地方登录了`
        if (isCore) {
          message = `再见 ${nickName}`
        }
        // 退出后还是要删除token
        this.logout()
        // router.push('/index')
        // 所有退出的时候都会断开连接, 所以在这里进行提示
        // 只有在vue实例创建后才能看见router实例
        ElNotification({
          title: '退出成功',
          message,
          type: 'success',
        })
        isCore = false
        // if (router?.app['_route']['path'] === '/index') {
        //   return
        // }
        router.push('/index')
      })
    },
    async login() {
      this.token = store.get(TOKEN_NAME) || ''
      await this.getUserInfo()
      if (!isMobile) {
        this.online()
        // if (router?.app['_route']['path'] === '/index') {
        //   return
        // }
      }
      router.push('/index')
    },
    // 使用异步获取user信息
    async getUserInfo() {
      try {
        let result = await $http({ type: 'userInfo' })
        let userInfo = result.data
        this.userInfo = userInfo
        if (!isMobile) {
          ElNotification({
            title: '登录成功',
            message: `欢迎你, ${userInfo.nickName}`,
            type: 'success',
          })
          router.push('/index')
        }
        // store中的this指向不是Vue实例
        // router.push({name: 'mHome'})
      } catch (err) {
        if (!isMobile) {
          console.log(err)
          ElNotification({
            title: '获取失败',
            message: err.message,
            type: 'error',
          })
        }
      }
    },
  },
})
